<template>
<div>
  <v-header></v-header>
  <div class="site-content">
    <div class="inner clearfix">
      <!-- 首页左侧 -->
      <div class="mode-left">
        <!-- 数据 -->
        <left-mode-con :base="mode"></left-mode-con>
        <v-nav></v-nav>
        <!-- 灰色线条 -->
        <div class="mode-left-line"></div>
        <!-- 首页左侧外链 -->
        <left-link  :links="links"></left-link>
        <!-- 首页左侧buy ark -->
        <left-btn :links="links"></left-btn>
        <!-- 首页左侧分享 -->
        <left-share :websites="websites">
        </left-share>
      </div>
      <!-- 首页右侧 -->
      <div class="mode-right">
        <router-view></router-view>
      </div>
    </div>
  </div>
</div>
</template>

<script>
// import $ from 'jquery'
import Header from "@/components/header.vue";
import Nav from "@/components/nav.vue";
import LeftLink from "@/components/leftLink.vue";
import LeftBtn from "@/components/leftBtn.vue";
import LeftShare from "@/components/leftShare.vue";
import LeftModeCon from "@/components/leftModeCon.vue";
import {runningBase} from "@/requests/api";

export default {
  name: `Home`,
  components:{
    LeftModeCon,
    LeftShare,
    LeftBtn,
    LeftLink,
    'v-nav':Nav,
    'v-header':Header
  },
  mounted() {
    // console.log($)
    this.getBase()
  },
  methods: {
    getBase(){
      runningBase({}).then(r=>{
        console.log({r})
        this.mode = r.data
        this.links = r.data.links
        this.websites= r.data.website
      })
    }
  },
  data() {
    return {
      mode:{},
      links:{},
      websites:{},
    }
  }

}
</script>

<style scoped>
.show{
  display: block;
}

</style>
